import React, { PureComponent, PropTypes } from "react";
import {
    View,
    Text,
    ImageBackground,
    StyleSheet,
    Modal,
    TouchableOpacity
} from "react-native";
import image from "../assets/image"
import AlertView from "./AlertView";
import ShareUtil from "../native/ShareUtil";
import {
    screenWidth,
    safeAreaBottomHeight,
} from "../util/AdapterUtil";

class ShareDialog extends PureComponent {

    constructor(props) {
        super(props);
        this.state = {
            isShowShare:false,
        }
    }

    static defaultProps ={
        title:"辛巴支付",
        content:"你好",
        imageUrl:"",
        url:"https://www.baidu.com",
    }

    render() {
        return (
            <AlertView isShow={this.state.isShowShare}
                       position={{ justifyContent: "flex-end" }}
                       contentStyle={styles.alertContentView}>
                <View style={{ flexDirection: "row", backgroundColor: "#efefef" }}>
                    <TouchableOpacity style={[styles.shareBackButton, { marginLeft: (screenWidth - 200) / 10 }]}
                                      onPress={this.shareAction.bind(this, "wx")}>
                        <ImageBackground source={image.my_share_wx} style={styles.shareImage} >
                            <View style={styles.shareTitleBackView}>
                                <Text style={styles.shareTitle}>微信</Text>
                            </View>
                        </ImageBackground>
                    </TouchableOpacity>
                    <TouchableOpacity style={styles.shareBackButton}
                                      onPress={this.shareAction.bind(this, "qq")}>
                        <ImageBackground source={image.my_share_qq} style={styles.shareImage} >
                            <View style={styles.shareTitleBackView}>
                                <Text style={styles.shareTitle}>QQ</Text>
                            </View>
                        </ImageBackground>
                    </TouchableOpacity>
                    <TouchableOpacity style={styles.shareBackButton}
                                      onPress={this.shareAction.bind(this, "pyq")}>
                        <ImageBackground source={image.my_share_pyq} style={styles.shareImage} >
                            <View style={styles.shareTitleBackView}>
                                <Text style={styles.shareTitle}>朋友圈</Text>
                            </View>
                        </ImageBackground>
                    </TouchableOpacity>
                    <TouchableOpacity style={[styles.shareBackButton, { marginRight: (screenWidth - 200) / 10 }]}
                                      onPress={this.shareAction.bind(this, "kj")}>
                        <ImageBackground source={image.my_share_kj} style={styles.shareImage} >
                            <View style={styles.shareTitleBackView}>
                                <Text style={styles.shareTitle}>空间</Text>
                            </View>
                        </ImageBackground>
                    </TouchableOpacity>
                </View>
                <View style={{ height: 1, backgroundColor: "#F2F4F8" }} />
                <TouchableOpacity style={{ justifyContent: "center", alignItems: "center", height: 50 }}
                                  onPress={this.hide.bind(this)}>
                    <Text style={{ color: "#505050", fontSize: 12 }}>取消</Text>
                </TouchableOpacity>
            </AlertView>
        );
    }

    shareAction(type) {
        this.setState({ isShowShare: false })
        let {url,title,content,imageUrl} = this.props
        switch (type) {
            case "wx":
                ShareUtil.share(content,imageUrl,url,title,2,(code,message) =>{

                });
                break
            case "qq":
                ShareUtil.share(content,imageUrl,url,title,0,(code,message) =>{

                });
                break
            case "pyq":
                ShareUtil.share(content,imageUrl,url,title,3,(code,message) =>{

                });
                break
            case "kj":
                ShareUtil.share(content,imageUrl,url,title,4,(code,message) =>{

                });
                break
        }
    }

    show() {
        this.setState({ isShowShare: true })
    }

    hide() {
        this.setState({ isShowShare: false })
    }
}

const styles = StyleSheet.create({
    alertContentView: {
        width: screenWidth,
        backgroundColor: "#fff",
        marginBottom: safeAreaBottomHeight
    },
    shareBackButton: {
        justifyContent: "center",
        alignItems: "center",
        flex: 1,
        marginTop: 20,
        marginBottom: 22
    },
    shareImage: {
        width: 50,
        height: 50,
        justifyContent: "flex-end",
        alignItems: "center"
    },
    shareTitleBackView: {
        backgroundColor: "#fff",
        borderRadius: 8,
        justifyContent: "center",
        marginBottom: -7,
        alignItems: "center",
        height: 16
    },
    shareTitle: {
        textAlign: "center",
        color: "#505050",
        fontSize: 10,
        marginLeft: 7,
        marginRight: 7
    },
});
export default ShareDialog;
